<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <title>员工详情</title>
    <script type="text/javascript" src="../../js/boot.js"></script>
    <style type="text/css">
        html, body {
            font-size: 14px;
            font-family: 微软雅黑;
        }
        .leftDiv{
            float:left;
            width: 21%;
            height: calc(100% - 2px);
            border-right: 1px solid #ccc;
        }
        .rightDiv{
            float:left;
            width: calc(79% - 1px);
            height: calc(100% - 1px);
        }

        .rowDiv{
            width:100%;
            height:40px;
            color: #666666;
            background:white;
        }
        .blueRow{
            background: #1ea3f0;
            color:#ffffff;
        }
        .rowDiv:hover{
            background: #1ea3f0;
            color:#ffffff;
            cursor: pointer;
        }
        .space{
            display:inline-block;
            width:calc(50% - 65px);
        }
        .choose{
            display:inline-block;
            width:20px;
            height:20px;
            border:1px solid #e3e3e3;
            border-radius:10px;
            background:white;
            vertical-align: middle;
        }
        .choose-image{
            background:white url(../../img/basic/xz_g.png) 4px 6px no-repeat;
        }
        .title-name{
            display:inline-block;
            height:40px;
            margin-left:5px;
            vertical-align: middle;
            line-height: 40px;
        }
    </style>
</head>
<body>
<div style = "height:100%;width:100%;">
    <div style="border-top: 1px solid #ccc;"></div>
    <div class="leftDiv">
        <div class="rowDiv" id="mes" onclick="changeMes(this,'1')">
            <div class="space"></div>
            <div class="choose choose-image"></div>
            <div class="title-name">员工基本信息</div>
        </div>
        <div class="rowDiv" id="mon" onclick="changeMes(this,'2')">
            <div class="space"></div>
            <div class="choose"></div>
            <div class="title-name">员工住宿信息</div>

        </div>
        <div class="rowDiv" id="mem" onclick="changeMes(this,'3')">
            <div class="space"></div>
            <div class="choose"></div>
            <div class="title-name">员工派车记录</div>

        </div>
        <div class="rowDiv" id="car" onclick="changeMes(this,'4')">
            <div class="space"></div>
            <div class="choose"></div>
            <div class="title-name">员工打卡记录</div>

        </div>
        <div class="rowDiv" id="yun" onclick="changeMes(this,'5')">
            <div class="space"></div>
            <div class="choose"></div>
            <div class="title-name">员工请假记录</div>

        </div>
        <div class="rowDiv"  onclick="changeMes(this,'6')">
            <div class="space"></div>
            <div class="choose"></div>
            <div class="title-name">员工加班记录</div>

        </div>
        <div class="rowDiv"  onclick="changeMes(this,'7')">
            <div class="space"></div>
            <div class="choose"></div>
            <div class="title-name">员工体检记录</div>

        </div>
        <div class="rowDiv"  onclick="changeMes(this,'8')">
            <div class="space"></div>
            <div class="choose"></div>
            <div class="title-name">员工培训记录</div>

        </div>

    </div>
    <div class="rightDiv">
        <iframe id="content" style="width:100%;height:100%" frameborder="0"></iframe>
    </div>
</div>

</body>
</html>
<script type="text/javascript">
    mini.parse();
    var a_type="1";

    var userID;
    var url=window.location.search; //获取url中"?"符后的字串
    if(url.indexOf("?")!=-1){
        url = url.substr(url.indexOf("=")+1);
        if(url.indexOf("&")!=-1){
            url = url.split("&")[0];
        }
    }
    userID = url;

    $("#mes").addClass("blueRow");
    $("#content").attr("src","/page/system/userInfo/userBaseMessage.html?userID="+userID);
    function changeMes(e,type){
        if($(e).hasClass("blueRow")) return;
        if($(e).children(".choose").hasClass("choose-image")) return;
        $(".rowDiv").removeClass("blueRow");
        $(".choose").removeClass("choose-image");
        $(e).addClass("blueRow");
        $(e).children(".choose").addClass("choose-image");
        a_type=type;
        getPath(type);
    }

    //获取跳转路径
    function getPath(type){
        if(type=="1"){
            $("#content").attr("src","/page/system/userInfo/userBaseMessage.html?userID="+userID);
        }else if(type=="2"){
            $("#content").attr("src","/page/system/userInfo/userDomitoryRecord.html?userID="+userID);
        }else if(type=='3'){
            $("#content").attr("src","/page/system/userInfo/userCarRecord.html?userID="+userID);
        }else if(type=='4'){
            $("#content").attr("src","/page/system/userInfo/userClockRecord.html?userID="+userID);
        }else if(type=='5'){
            $("#content").attr("src","/page/system/userInfo/userWorkApplyRecord.html?userID="+userID);
        }else if(type=='6'){
            $("#content").attr("src","/page/system/userInfo/userOverTimeRecord.html?userID="+userID);
        }else if(type=='7'){
            $("#content").attr("src","/page/system/userInfo/userExamineRecord.html?userID="+userID);
        }else if(type=='8'){
            $("#content").attr("src","/page/system/userInfo/userTrainRecord.html?userID="+userID);
        }

    }
    //用于子iframe刷新页面
    function reload(){
        $("#content").attr("src","");
       // getPath(a_type);
    }
</script>